<template>
	<div class="stock-contianer">
		<van-list v-model="dataset.loading" :finished="dataset.finished" finished-text="没有更多内容了" @load="controllerRequestList">
            <template v-for="(item, index) in dataset.items">
                <div class="stock-tray-title" :key="index">
                    <dl>
                        <dt>{{ item.name }}</dt>
                        <dd>
                            <p>总重量：<span>{{ item.znumber }}kg</span></p>
                        </dd>
                    </dl>
                </div>
                <tray-item-list v-for="(x, y) in item.item" :key="index + '-' + y"
                    @onSelectOperate="eventOnSelectItemOperate"
                    :ibase="[]" :dataset="x" :index="index" :allSelect="allSelectState"
                    class="stock-order-list"
                />
            </template>
		</van-list>
		<div class="page-bottom-bar">
			<div class="flex-item check-all-select">
				<van-checkbox v-model="allSelectState">全选</van-checkbox>
			</div>
			<div class="flex-item tip-message">已选择 {{ selectItems.length }} 条数据</div>
			<div class="flex-item">
				<span @click="eventClickPopSelectItem" class="bar-button bar-button-green">出库</span>
			</div>
		</div>
	</div>
</template>

<script>
    import { List, Checkbox } from 'vant';

    import TrayItemList from '../../components/currency/order-item/normal-list-stock-tray.vue';

	export default {
		components: {
			[List.name]: List, [Checkbox.name]: Checkbox,
			TrayItemList
		},
		data() {
			return {
				allSelectState: false, selectItems: [],
				trayId: 0,
				dataset: {
					page: 0, limit: 30,
                    loading: false, finished: false,
                    items: [],
                    trayList: [], orderList: []
				}
			}
		},
		mounted() {
			// console.log('stock-out', this.$route.query);
		},
		methods: {
			buildFormaDataset() {
				var result = [];

				for (let x of this.selectItems) {
                    for(let y of x.detail[0].goid) {
                        result.push(y);
                    }
                }

				return result;
			},
			controllerRequestList() {
				var url = '/api/home/tray/trayorderList',
					params = {
						token: this.$store.state.options.user.token,
						id: this.$route.query.garbageid
                    };

				this.$util.postRequestInterface(url, params, (res) => {
                    if(res.data) {
                        for(let x of res.data) {
                            let item = [];

                            if(x.orderlist) {
                                for(let y of x.orderlist) {
                                    let itemTmp = {
                                        ordernumne: y.ordernumne,
                                        detail: [{
                                            goid: y.goid,
                                            title: y.garbageall.name,
                                            number: y.garbageall.weighting_num,
                                            unit: 'kg',
                                            time: this.$moment(y.create_time * 1000).format('YYYY-MM-DD')
                                        }]
                                    }

                                    item.push(itemTmp);
                                }

                                this.dataset.items.push({
                                    name: x.number,
                                    allnumner: x.allnumner,
									znumber: x.znumber,
                                    item
                                });
                            }
                        }
                    }

                    // console.log(this.dataset);

					this.dataset.finished = true;
					this.dataset.loading = false;
				});
			},
			eventClickPopSelectItem() {
				if (this.selectItems.length == 0) {
					this.$toast('请选择要出库的选项');
					return;
                }

                var url = '/api/home/tray/orderadd',
                    params = {
                        id: this.$route.query.id,
                        ids: JSON.stringify(this.buildFormaDataset()),
                        token: this.$store.state.options.user.token
                    };

                // console.log(params);

				this.$util.postRequestInterface(url, params, (res) => {
					// if (res.data) {
					// } else {
					// 	// 出库失败
					// }
					this.$router.push({
                        path: '/reservoirManagement/index', query: {
                            index: 2
                        }
                    });
				});
			},
            eventOnSelectItemOperate(params) {
                if(params.select) {
                    this.selectItems.push(params.data);
                } else {
                    for(let i in this.selectItems) {
                        if(this.selectItems[i].ordernumne == params.data.ordernumne) {
                            this.selectItems.splice(i, 1);
                            break;
                        }
                    }
                }
            }
		},
		watch: {
			allSelectState(nVal, oVal) {
				this.selectItems = [];
			}
		}
	}
</script>


<style scoped lang="scss">
	@import "../../libs/styles/bottom-fixed-bar.scss";

	.stock-tray-title {
		padding: 0.8rem 1.6rem;
		border-bottom: 0.4rem solid #f4f4f4;

		dt {
			color: #333333;
			font-size: 1.4rem;
		}

		dd {
			display: flex;

			p {
				font-size: 1.3rem;
				color: #999999;
			}

			p span {
				color: #00cc00;
			}
			// p:last-child{
			//     margin-left: 1rem;
			// }
		}
	}

	.stock-listing {
		li {
			padding: 1.6rem;
			display: flex;
			font-size: 1.4rem;
			border-bottom: 0.4rem solid #f4f4f4;

			p {
				color: #999999;
			}

			p:first-child {
				flex: 1;
				color: #333333;
			}

			p:last-child {
				margin-left: 1rem;
			}

			p span {
				color: #00cc00;
			}
		}
	}

	.stock-order-list {
		padding: 0.6rem 0.5rem 1.6rem;
	}
</style>
